<!--
   	 
  			v-import前面若是有其他控件，需要用<div style="float: left;">包裹起来
  			
  	参数: colnameData[]参数--约定的列名列表
  		colName[]------------数据库字段名列表
  		cmd  ''--------------调用的cmd命令名
	回调函数:
  			@importResult--------------返回导入结果
        说明：在组件中用v-if="showInput"	,在回调函数里面用
        this.showInput = false;
		this.$nextTick(function(){
		    this.showInput = true;
		})可以避免第二次上传相同文件无法响应change事件的问题		
-->

<template>
	<div >
		<div class="content-a-upload">
			<input type="file" id="file-select" @change="handleChange">Excel表导入
		</div>
	</div>
</template>

<script>
	// import { query, apiparas, execute } from '../../api/api';
	import axios from 'axios';
	export default {
		props: ['colnameData','colName','cmd','type','map'],
		data() {
			return {
				xlsData: {},
				dataHead: [{"name":"dd","value":"dd"}],
				paras:{}
			}
		},
		mounted: function() {
			//生命周期
			
		},
		computed: {
			//计算属性
			
		},
		methods: { //函数
			pushPara: function(paras, pname, pvalue) {
				let p = {
					'name': pname,
					'value': pvalue
				};
				paras.push(p);
			},
			handleChange(event){
				//console.log(BASE_API);
				if(event.target.files.length===0||event===null){
					return;
				}
				let _this = this;
//				console.log(event,"我是event")
				// 通过DOM取文件数据
				let file = event.target.files[0];
				console.log(file,"w shi file")
				//return;
				let rABS = false; //是否将文件读取为二进制字符串
				let f = file;
				let reader = new FileReader();
				//if (!FileReader.prototype.readAsBinaryString) {
				FileReader.prototype.readAsBinaryString = function(f) {
					let binary = "";
					let rABS = false; //是否将文件读取为二进制字符串
					let pt = this;
					let wb; //读取完成的数据
					console.log(wb,"我是wb")
					let outdata;
					let reader = new FileReader();
					
					reader.onload = function(e) {
						try{
							let bytes = new Uint8Array(reader.result);
							let length = bytes.byteLength;
							for(let i = 0; i < length; i++) {
								binary += String.fromCharCode(bytes[i]);
							}
							let XLSX = require('xlsx');
							if(rABS) {
								wb = XLSX.read(btoa(fixdata(binary)), { //手动转化
									type: 'base64'
								});
							} else {
								wb = XLSX.read(binary, {
									type: 'binary'
								});
							}
							outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]], {
								header: 1
							}); //outdata就是你想要的东西
							_this.xlsData = [...outdata];
							console.log(_this.xlsData,'_this.xlsData');
							_this.xlsData.splice(0,1);
// 							console.log(_this.xlsData,'_this.xlsData2');
// 							console.log(typeof(_this.xlsData),'_this.xlsData222');
							
							let jsondata = [];
							for(let i=0;i<_this.xlsData.length;i++){
								jsondata.push({
									"goods_id":_this.xlsData[i][0],
									"goods_name":_this.xlsData[i][1],
									"goods_type":_this.xlsData[i][2],
									"state":_this.xlsData[i][3],
									"label":_this.xlsData[i][4],
									"sex":_this.xlsData[i][5],
									"season":_this.xlsData[i][6],
									"year":_this.xlsData[i][7],
									"price":_this.xlsData[i][8],
									"cost":_this.xlsData[i][9],
									"material":_this.xlsData[i][10],
									"size_id":_this.xlsData[i][11],
									"color_id":_this.xlsData[i][12],
									"quantity":_this.xlsData[i][13],
									"picture":_this.xlsData[i][14],
								})
							}
							
							console.log(jsondata,'jsondata');
							
							
							axios({
							  method: 'post',
							  url: '/api/insert_moregoods',
							  headers: {
								'Content-Type': 'application/json;charset=UTF-8'
							  },	 
								data:  jsondata
							}).then((res) => {
								 _this.$notify({
								  title: '成功',
								  message: '创建成功',
								  type: 'success',
								  duration: 2000
								})
							})
							
							
							
// 							_this.dataHead = [];
// 							let colIndex = []; //找到列对应的位置
// 							let t_col = [];
// 							let row_start = 1;
// 							for(let i = 0; i < _this.xlsData[0].length; i++) {
// 								pushPara(_this.dataHead , _this.xlsData[0][i], _this.xlsData[0][i]);
// 							}
// 							console.log(_this.dataHead,'_this.dataHead');
// 							t_col = _this.colnameData; 
// 							
// 							for(let i = 0; i < t_col.length; i++) {
// 								for(let j = 0; j < _this.dataHead.length; j++) {
// 	
// 									if(_this.dataHead[j]['name'] == t_col[i]) //找需要导入数据列的对应列顺序
// 									{
// 										colIndex.push(j);
// 										continue;
// 									}
// 								}
// 	
// 							}
// 							let objs = [];
// 							for(let i = row_start; i < _this.xlsData.length; i++) {
// 									let obj = {};
// 									for(let j = 0,len = _this.colName.length; j<len;j++){
// 										obj[_this.colName[j]] = _this.xlsData[i][colIndex[j]]
// 									}									
// 									objs.push(obj);
// 							}
// 							let json = {};
// 							json.subs = objs;
// 							//遍历，将map中的数据添加进json对象
// 							if(_this.map!=null){
// 								for (let [key, value] of _this.map.entries()) {
// 									json[key] = value;
// 								}
// 							}
							// console.log(json,'json');
							_this.$message({
								message: '请耐心等待导入成功',
								type: 'success'
							});
						}catch(e){
							_this.$message({
								message: '导入失败！请导入Excel文件',
								type: 'error'
							});
						}
					}
					reader.readAsArrayBuffer(f);
				}
				if(rABS) {
					reader.readAsArrayBuffer(f);
				} else {
					reader.readAsBinaryString(f);
				}
			}
		},
		created: function() {
			
		},
		update:function(){
			
		},
		watch: {
		
		}

	}
</script>

<style>
.content-a-upload {
    position: relative;
    top:0px;
    height: 40px;
    /*width: 50px;*/
   	font: 10 15px/40px "宋体";
    text-align: center;
    cursor: pointer;
    color: #fff;
    background: #409EFF;
    border: 1px solid #b3d8ff;
    border-radius: 5px;
    overflow: hidden;
    display: inline-block;
    text-decoration: none;
		padding: 0 10px;
}
.content-a-upload input {
    position: absolute;
    font-size: 15px;
    height: 40px;
    right: 0;
    top: 0px;
    opacity: 0;
    cursor: pointer;
}
.content-a-upload:hover {
    color: #fff;
    background: #409EFF;
    border-color: #409EFF;
    text-decoration: none
}
</style>